<template>
  <lc-chart-instrument-panel
    ref="instrumentPanelRef"
    :options="instrumentPanelOptions"
    :map-options="instrumentPanelMapOptions"
    :data="instrumentPanelData"
    style="--height: 300px"
  ></lc-chart-instrument-panel>
</template>

<script setup>
import { ref } from "vue";

import { request } from "@/apis/request";
defineOptions({
  name: "InstrumentPanel",
});

const instrumentPanelRef = ref(null);
const instrumentPanelData = ref([]);
const instrumentPanelMapOptions = ref({});
const instrumentPanelOptions = ref({
  title: { text: "", top: 10, left: 10 },
  grid: {
    left: "6%",
    top: "20%",
    right: "5%",
    bottom: "10%",
    containLabel: true,
  },
  tooltip: { trigger: "item", formatter: "" },
  series: [{ type: "gauge", radius: "75%", center: ["50%", "65%"] }],
});

const getInstrumentPanelData = async () => {
  try {
    let params = { url: "", method: "get", params: {} };
    const res = await request(params);
    if (res) {
      instrumentPanelData.value = res.data || [];
    }
  } catch (e) {
    console.error("获取数据出错: " + e);
  }
};
getInstrumentPanelData();
</script>
